import { useState } from "react";
import GpuCanvas from "../../components/GpuCanvas";
import DatGui, { DatBoolean, DatNumber } from "react-dat-gui";
export default function PointsSample() {
  const appName = "Points";
  const [selectData, setSelectData] = useState({
    fixedSize: false,
    textured: false,
    size: 10,
  });
  return (
    <div
      style={{
        width: "100%",
        height: "100%",
      }}
    >
      <GpuCanvas app={appName} data={selectData}/>
      <DatGui data={selectData} onUpdate={setSelectData}>
        <DatBoolean path="fixedSize" />
        <DatBoolean path="textured" />
        <DatNumber path="size" min={0} max={80} step={5} />
      </DatGui>
    </div>
  );
}
